<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="maximum-scale=1.0, minimum-scale=1.0, user-scalable=0, initial-scale=1.0, width=device-width" />
<meta name="format-detection" content="telephone=no, email=no, date=no, address=no">
<title>Hello APP</title>
<link rel="stylesheet" type="text/css" href="../../css/aui-flex.css" />
<link rel="stylesheet" type="text/css" href="../../css/aui.css" />
<link rel="stylesheet" type="text/css" href="../../css/common.css" />
<style>
	.content {
		height: 100vh;
	}
	.photoList {
		padding: 0.25rem;
		width: 100%;
	}
	.photoList > div {
		float: left;
		width: 33.33%;
		padding: 0.25rem;
	}
	.photoList .pic {
		height: 0;
		padding-bottom: 100%;
		position: relative;
		border-radius: 0.4rem;
		overflow: hidden;
	}
	.photoList .pic .delBtn {
		position: absolute;
		right: 0;
		top: 0;
		width: 1.4rem;
		height: 1.4rem;
		background: url(../../image/common/39.png) no-repeat center center;
		background-size: 0.85rem;
		z-index: 1;
	}
	.addBtn .pic {
		border-radius: 0;
		background: url(../../image/publish/12.png) no-repeat center center;
		background-size: 100% 100%;
	}


	textarea {
		padding: 0.5rem;
		font-size: 0.7rem;
		overflow: auto;
		-webkit-overflow-scrolling: touch;
	}
</style>
</head>

<body>
<div id="app">
	<div class="content aui-flex-row">
		<draggable v-model="publish_label" @start="drag=true" @end="drag=false" :options="{draggable:'.picItem',delay: 200}" class="photoList clearfix" id="sortList">
			<div class="picItem" v-for="(it,i) in publish_label">
				<div class="pic bgCover" v-tap="[edit]" :style="{ 'background-image' : 'url('+ it.image +')' }">
					<div class="delBtn" v-tap.stop="[del,i]"></div>
				</div>
			</div>
			<div class="addBtn" v-tap="[addNew]"><div class="pic"></div></div>
		</draggable>
		<textarea class="flex-auto" v-model="text" placeholder="这一刻，想说点什么…"></textarea>
	</div>
</div>
</body>
<script type="text/javascript" src="../../script/import.js"></script>
<script type="text/javascript" src="../../script/common.js"></script>
<script type="text/javascript" src="../../script/vue.js"></script>
<script type="text/javascript" src="../../script/vue-tap.js"></script>
<script type="text/javascript" src="../../script/Sortable.min.js"></script>
<script type="text/javascript" src="../../script/vuedraggable.min.js"></script>
<script type="text/javascript">
var isSave = false;
var paramData = {};
var godIds = [];
var vm;
var vuedata = {
	article_id: '',
	text: '',
	publish_label: []
};
vm = new Vue({
	el: '#app',
	data: vuedata,
	methods: {
		del:function(ind){
			if(vuedata.publish_label.length > 1){
				vuedata.publish_label.splice(ind,1);
			}else{
				openAlertMask('至少保留一张照片');
			}
		},
		edit: function(){
			savePage();
			setTimeout(function(){
				api.openWin({
					name: 'publish_next',
					url: 'publish_next.html',
					reload: true,
					bounces: false,
					slidBackEnabled: false
				});
			},50);
			
		},
		addNew: function(){
			savePage();
			setTimeout(function(){
				api.openWin({
					name: 'publish_win',
					url: 'publish_win.html',
					reload: true,
					bounces: false,
					slidBackEnabled: false
				});
			},50);
		}
	}
});
apiready = function() {
	api.parseTapmode();
	paramData = api.pageParam;
	if(paramData.article_id){
		vuedata.article_id = paramData.article_id;
		getData();
	}else{
		if( getPrefs('_PUBLISH_LABEL_') ){
			vuedata.publish_label = getPrefs('_PUBLISH_LABEL_');
		}
		if( getPrefs('_PUBLISH_EDIT_ID_') ){
			vuedata.article_id = getPrefs('_PUBLISH_EDIT_ID_');
		}
		if( getPrefs('_PUBLISH_EDIT_CONTENT_') ){
			vuedata.text = getPrefs('_PUBLISH_EDIT_CONTENT_');
		}
	}
	
};
//获取草稿
function getData(){
	api.ajax({
		url: BASE_URL + 'App/Article/articleDetail',
		method: 'post',
		data: {
			values: {
				userid: getUserId(),
				article_id: vuedata.article_id
			}
		}
	},function(ret,err){
		if (ret && ret.code == 1) {
			vuedata.publish_label = ret.data.article_label;
			vuedata.text = ret.data.article_content;
			savePage();
		}
	});
}
//跳转其他页面 先保存本页的数据
function savePage(){
	setPrefs('_PUBLISH_LABEL_', vuedata.publish_label);
	setPrefs('_PUBLISH_EDIT_ID_', vuedata.article_id);
	setPrefs('_PUBLISH_EDIT_CONTENT_', vuedata.text);
}
//发布
function save(n){
	var type = n;
	if(isSave){
		return;
	}
	if(type == 1 && !vuedata.text){
		toast('说点什么吧');
		return;
	}
	isSave = true;
	godIds = [];
	for(var i=0;i<vuedata.publish_label.length;i++){
		for(var n=0;n<vuedata.publish_label[i].labelData.length;n++){
			godIds.push(vuedata.publish_label[i].labelData[n].godId);
		}
	}
	var postData = {
		userid: getUserId(),
		article_goods: godIds.join(','),
		article_cover: vuedata.publish_label[0].image,
		article_content: vuedata.text,
		article_label: vuedata.publish_label
	}
	if( type == 0 ){
		postData.draft = 1;
	}
	var postUrl = 'App/Article/addArticle';
	if(vuedata.article_id){
		postData.article_id = vuedata.article_id;
		postUrl = 'App/Article/editArticle';
	}
	api.ajax({
		url: BASE_URL + postUrl,
		method: 'post',
		data: {
			values: postData
		}
	},function(ret,err){
		if (ret && ret.code == 1) {
			if(postData.draft && postData.draft == 1){
				toast('保存草稿成功');
			}else{
				toast('已提交审核');
			}
			
			setTimeout(function(){
				goHome(1);
			},1000);
		}else{
			toast('操作失败');
			isSave = false;
		}
	});
}
</script>
</html>
